<template>
  <div class="list">
    <div class="box">
      <div class="header">
        <div class="item-text box-title">
          为您找到相关企业至少 <span class="number-of-enterpise">{{ number }}</span> 个
        </div>
      </div>
      <div class="condition">
        <div class="item">
          关键词搜索 
          <el-input
            placeholder="请输关键词搜索"
            v-model="condition.key_words"
          />
        </div>
        <div class="item">
          公司名称 
          <el-input
            placeholder="请输公司名称"
            v-model="condition.company_name"
          />
        </div>
        <div class="item">
          目标区域
          <el-select
            v-model="condition.region"
            placeholder="请选择地区"
          >
            <el-option
              :value="-1"
              label="所有地图"
            />
            <el-option
              v-for="item in regions"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </div>
        <div class="item center">
          <el-button
            type="primary"
          >
            <ali-icon icon="iconsousuo"></ali-icon>
            搜索
          </el-button>
          <el-button>
            <ali-icon icon="iconzhongzhi"></ali-icon>
            重置
          </el-button>
        </div>
      </div>
    </div>
    <div class="list-view box">
      <el-table
      class="list-table"
        :data="tableData"
        style="width: 100%"
      >
        <el-table-column
          type="selection"
          width="55"
        >
        </el-table-column>
        <el-table-column
          prop="companyName"
          label="企业名称"
          width="180"
        >
        </el-table-column>
        <el-table-column
          prop="sc_date"
          label="招聘标题"
        >
        </el-table-column>
        <el-table-column
          prop="address"
          label="职位"
        >
        </el-table-column>
        <el-table-column
          prop="zczb"
          label="薪资"
        >
        </el-table-column>
        <el-table-column
          prop="zcrq"
          label="工作城市"
        >
        </el-table-column>
        <el-table-column
          prop="id"
          label="要求"
        >
        </el-table-column>
        <el-table-column
          prop="id"
          label="来源"
        >
        </el-table-column>
        <el-table-column
          prop="id"
          label="收录日期"
        >
        </el-table-column>
      </el-table>
      <page
        :total="total"
        :current.sync="condition.page"
        :size.sync="condition.size"
        @change="search"
      />
    </div>
  </div>
</template>

<script>
import { fetchRegion } from "@/api";
import Page from "@/components/list/page"

export default {
  components: {
    Page
  },
  data() {
    return {
      number: 3548,
      total:100,
      regions: [],
      tableData:[
        {
          id: 123
        }
      ],
      loading:true,
      condition: {
        page:1,
        size:10,
        key_words: '',
        region: '',
        company_name: ''
      }
    }
  },
  created() {
    this.getRegion();
  },
  methods: {
    getRegion() {
      fetchRegion(101, res => {
        if (res.code === 1) {
          this.regions = res.data.region;
        }
      });
    },
    search(){
    }
  }
};
</script>

<style lang="scss" scoped>
@import "@/styles/apps/apps/search";
</style>

<style>
.el-table thead {
  color: #2F3133;
}
.el-table th {
  background-color: #F5F7F9;
}
</style>
